{% load staticfiles %}
<div class="modal fade" id="lecture_modal" role="dialog">
    <div class="modal-dialog" style="width:750px;">
        <div class="modal-content">
            <div class="modal-header">
                <a href="#" class="btn btn-success pull-right" data-dismiss="modal">×</a>
                <h4>Note: {{ note.title }}</h4>
            </div>
            <div class="modal-body">
                <form method=''
                      action=''
                        name="NoteForm">
                        {% if note.type == 1 %}
                        <iframe id="pdf_response" src="{{ note.file.url }}" width="100%" height="950px"></iframe>
                        {% else %}
                        UNSUPPORTED FILE TYPE
                        {% endif %}
                </form>
            </div>
        </div>
    </div>
</div>


<script>
    $(document).ready(function(){
        // When this model hides, we will clear the contents of it.
        $('#lecture_modal').on('hidden.bs.modal', function (e) {
            // Clear all the code inside this modal.
            $('#ajax_modal_placeholder').html('');
            $('#play_{{ lecture.lecture_id }}_btn').prop("disabled", false); // Unlock button
        })
    });
</script>
